<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index</title>
    <style>
        html{
    font-size: 100px;
}
body{
    width: 100%;
    font-size:0.16rem;

}
* body{
    margin: 0;
    padding: 0;
    margin-left: 1rem;
}
.header{
    width: 100%;
    height: 1.5rem;
    background-color: white;
}
.main{
    width: 100%;
    height: 14rem;
    background-color:white;
}
.footer{
    width: 100%;
    height: 0.5rem;
    background-color:white;
    line-height: 0.5rem;
    {#text-align: center;#}
}
.header-divFirst{
    line-height: 1rem;
    margin-left: 0.5rem;


}
#ip1{
    height: 0.5rem;
    width: 35%;
    vertical-align:middle;
    border: #5588aa solid 0.001rem;
    outline:none;
    font-size: 0.2rem;
    font-family: '微软雅黑';
    margin-top: 0.3rem;
}
#ip2{
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    height: 0.5rem;
    width:5%;
    text-align: center;
    vertical-align:middle;
    border: none;
    background-color: #5588aa;
    margin-top: 0.3rem;
}
.ul1 li{
    display: inline-block;
    line-height: 0.6rem;
    font-size: 0.2rem;
    color: red;
}
.ul1 li a{
    text-decoration:none
}
.main a{
    text-decoration:none
}
.main .title{
    font-weight:500;
    font-size: 0.25rem;
}
.main .content{
    /*font-weight:500;*/
    font-size: 0.2rem;
}
.main a:hover{
    color: mediumvioletred;
}
.main_divFirst{
    margin-left: 1rem;

}
.main p{
    margin: -0.1rem auto;
    margin-left: 0.3rem;
    width: 55%;
    /*height: 1rem;*/
    overflow: hidden;
    text-overflow: ellipsis;
    /*background-color: goldenrod;*/
    display: -webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    overflow: hidden;
}
.footer .pagination{
    margin-left: 1rem;
    font-size: 0.15rem;
}
    </style>
</head>
<body>
<header class="header">
    <form method="get" action="{% url 'detail' %}">
        <div class="header-divFirst">
            <input type="text" id="ip1" name="search">
            <input type="submit" value="搜索" id="ip2">
        </div>
    </form>
</header>
<main class="main">
    {% for i in pages.object_list %}
        <div class="main_divFirst">
            <a href="{% url 'jump' i.0 %}" target="_blank">
                <h3 class="title">{{ i.1 }}</h3>
            </a>
                <p class="content">{{ i.2 }}</p>
        </div>
    {% endfor %}
</main>
<footer class="footer">
<div class="pagination">
    <span class="step-links">
        {% if pages.has_previous %}
            <a href="?search={{ search }}&&page={{ pages.previous_page_number }}">上一页</a>
        {% endif %}

        <span class="current">
            当前为第 {{ pages.number }}页 ， 总共{{ pages.paginator.num_pages }}页.
        </span>

        {% if pages.has_next %}
            <a href="?search={{ search }}&&page={{ pages.next_page_number }}">下一页</a>
        {% endif %}
    </span>
</div>
</footer>
</body>
</html>
